<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./CSS/reset.css">
    <link rel="stylesheet" href="./CSS/style.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_3215787_hpzk1eow83.css">
    <link rel="stylesheet" href="./CSS/swiper.min.css">
    <script src="./js/swiper.min.js"></script>
</head>
<body>
    <div id="header">
    <div class="center">
        <ul>
            <li><a href="" >小米商城</a></li>
            <li><a href="">MIUI</a></li>
            <li><a href="">loT</a></li>
            <li><a href="">云服务</a><li>
            <li><a href="">天星数科</a></li>
            <li><a href="">有品</a></li>
            <li><a href="">小爱开放平台</a></li>
            <li><a href="">企业团购</a></li>
            <li><a href="">资质证照</a></li>
            <li><a href="">协议规则</a></li>
            <li><a href="">下载app</a></li>
            <li><a href="">SelectLocation</a></li>
         </ul>
         <ol>
            <li><a href="login.html">秋叶</a></li>
            <li><a href="zhuce.html">你好</a></li>
            <li><a href="">消息通知</a></li>
         </ol>
         <div class="box2">
             <a href="./gwc.html">
            <i class="iconfont icon-gouwuche4"></i>
            <span>购物车 (0)</span>
            </a>
        </div>
       
    </div>
    </div>
    <div id="toubu">
        <div class="toubu-box1">
            <img src="./images/小米_03.png" alt="">
            <div class="toubu-box2">
                <ol>
                  <li><a href="">Xiaomi手机</a></li>
                  <li><a href="">Redmi 红米</a></li>
                  <li><a href="">电视</a></li>
                  <li><a href="">笔记本</a></li>
                  <li><a href="">平板</a></li>
                  <li><a href="">家电</a></li>
                  <li><a href="">路由器</a></li>
                  <li><a href="">服务</a></li>
                  <li><a href="">社区</a></li>
                </ol>
             </div>
             <input type="text" value="电视">
             <div class="iconfont  icon-sousuo1" id="sousuo"></div>
             <div class="gwccd">购物车中还没有商品,赶紧选购吧</div>
              </div>
       
         </div> 
          <div id="lunbotu">
         <div class="caidan">
            <div class="caidan-1"></div>
          <li><i>手机</i><span class="iconfont icon-youjiantou"></span></li>
          <li><i>电视</i><span class="iconfont icon-youjiantou"></span></li>
          <li><i>笔记本 平板</i><span class="iconfont icon-youjiantou"></span></li>
          <li><i>家电</i><span class="iconfont icon-youjiantou"></span></li>
          <li><i>出行 穿戴</i><span class="iconfont icon-youjiantou"></span></li>
          <li><i>智能 路由器</i><span class="iconfont icon-youjiantou"></span></li>
          <li><i>电源 配件</i><span class="iconfont icon-youjiantou"></span></li>
          <li><i>健康 儿童</i><span class="iconfont icon-youjiantou"></span></li>
          <li><i>耳机 音箱</i><span class="iconfont icon-youjiantou"></span></li>
          <li><i>生活 箱包</i><span class="iconfont icon-youjiantou"></span></li>
          <div class="caidan-1"></div>
        </div> 
        <div class="swiper-container lunbo">
            <div class="xym xym1" >
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
                <li><img src="./imges/0.99.png.gif" alt=""><span>Xiaomi Civi 1S</span></li>
             </div>
             <div class="swiper-wrapper">
             <div class="swiper-slide"><img src="./images/01.png"  alt="" style="width: 100%;height: 100%;"></div>
             <div class="swiper-slide"><img src="./images/02.png"  alt="" style="width: 100%;height: 100%;"></div>
             <div class="swiper-slide"><img src="./images/03.png" alt=""  style="width: 100%;height: 100%;"></div>
              <div class="swiper-slide"><img src="./images/04.png" alt="" style="width: 100%;height: 100%;" ></div>
             <div class="swiper-slide"><img src="./images/05.png" alt="" style="width: 100%;height: 100%;" ></div>
            
             </div>
             <div class="swiper-button-next"></div>
             <div class="swiper-button-prev"></div>
        </div>
    </div>
    <!-- 轮播图下面的四个小盒子↓ -->
    <div id="sigexiaohezi">
        <div class="xhzbx">
            <div id="sigehezi">
                <!-- 轮播图下面的小盒子第一个 -->
              <div id="xiaohezi-1">
                  <li><span class="iconfont icon-shizhongfill"></span><i>保障服务</i></li>
                  <li><span class="iconfont icon-louceng"></span><i>企业团购</i></li>
                  <li><span class="iconfont icon-xiaomishangchengFma"></span><i>F通行码</i></li>
                  <li><span class="iconfont icon-mifenqia"></span><i>米粉卡</i></li>
                  <li><span class="iconfont icon-yijiuhuanxin2"></span><i>以旧换新</i></li>
                  <li><span class="iconfont icon-huafeichongzhi1"></span><i>话费充值</i></li>
                </div>
            </div>
            <img src="./images/小米_06.png" alt="" class="tp1">
          <img src="./images/小米_07.png" alt="" class="tp2">
          <img src="./images/小米_08_07.png" alt="" class="tp3">
        </div>
    </div>
    <!-- 四个盒子下面的居中图↓ -->
    <div id="juzhong">
       <div class="box1"> <img src="./images/小米_04.png" alt="" class="tp4"></div> 
       <p>手机</p> <div class="bq">
        <h4>查看更多</h4><span class="iconfont icon-chakangengduoshuju"></span></div>
    </div>
    <div id="shouji">
       <div class="sjbx">
            <img src="./images/小米.11png_03.png" alt="">
            <div class="sjbx-2">
                <a href="./xqy.html">
                <div class="sjbx-3">
                    <img src="./images/10.png" alt="">
                <span>Redmi 10A</span>
                <li>大屏幕 </li> 
                <h4>649元起 <del style="color: #b0b0b0; "> 699元</del></h4>  
            </div>
           </a>
            <div class="sjbx-3">  
                <img src="./images/10.png" alt="">
            <span>Redmi 10A</span>
            <li>大屏幕 </li> 
            <h4>649元起 <del style="color: #b0b0b0; "> 699元</del></h4>
        </div>
        <div class="sjbx-3">
            <img src="./images/10.png" alt="">
        <span>Redmi 10A</span>
        <li>大屏幕 </li> 
        <h4>649元起 <del style="color: #b0b0b0; "> 699元</del></h4>
    </div>
    <div class="sjbx-3" >
        <img src="./images/10.png" alt="">
    <span>Redmi 10A</span>
    <li>大屏幕 </li> 
    <h4>649元起 <del style="color: #b0b0b0; "> 699元</del></h4>
</div>
<div class="sjbx-3">
    <img src="./images/10.png" alt="">
<span>Redmi 10A</span>
<li>大电量, 大音量，大屏幕 </li> 
<h4>649元起 <del style="color: #b0b0b0; "> 699元</del></h4>
</div>
<div class="sjbx-3">
    <img src="./images/10.png" alt="">
<span>Redmi 10A</span>
<li>大电量, 大音量，大屏幕 </li> 
<h4>649元起 <del style="color: #b0b0b0; "> 699元</del></h4>
</div>
<div class="sjbx-3">
    <img src="./images/10.png" alt="">
<span>Redmi 10A</span>
<li>大电量, 大音量，大屏幕 </li> 
<h4>649元起 <del style="color: #b0b0b0; "> 699元</del></h4>
</div>
<div class="sjbx-3">
    <img src="./images/10.png" alt="">
<span>Redmi 10A</span>
<li>大电量, 大音量，大屏幕 </li> 
<h4>649元起 <del style="color: #b0b0b0; "> 699元</del></h4>
</div>
 </div>
    </div>
    <div id="zncd">
        <div class="zncd-1"> 
            <p>智能穿戴</p><li>热门</li><span>穿戴</span>
        </div>
     </div>
     <div id="zncd1">
        <div class="zncd">
             <img src="./images/小米_010.png" alt="">
             <div class="zncd-2">
                 <div class="zncd-3">
                     <img src="./images/011.png" alt="">
                 <span>Xiaomi Watch S1</span>
           <li>腕事俱备<h4>1049元起 <del style="color: #b0b0b0; "> 1099元</del></h4>  
             </div>
             <div class="zncd-3">
                 <img src="./images/011.png" alt="">
             <span>Xiaomi Watch S1</span>
     <li>腕事俱备</li><h4>1049元起 <del style="color: #b0b0b0; "> 1099元</del></h4>
         </div>
         <div class="zncd-3">
             <img src="./images/011.png" alt="">
         <span>Xiaomi Watch S1</span>
         <li>腕事俱备</li><h4>1049元起 <del style="color: #b0b0b0; "> 1099元</del></h4>
     </div>
     <div class="zncd-3" >
         <img src="./images/011.png" alt="">
     <span>Xiaomi Watch S1</span>
     <li>腕事俱备</li><h4>1049元起 <del style="color: #b0b0b0; "> 1099元</del></h4>
     </div>
     <div class="zncd-3">
     <img src="./images/011.png" alt="">
      <span>Xiaomi Watch S1</span>
     <li>腕事俱备</li> 
     <h4>1049元起 <del style="color: #b0b0b0; "> 1099元</del></h4>
     </div>
       <div class="zncd-3">
     <img src="./images/011.png" alt="">
      <span>Xiaomi Watch S1</span>
     <li>腕事俱备</li> 
     <h4>1049元起 <del style="color: #b0b0b0; "> 1099元</del></h4>
     </div>
     <div class="zncd-3">
     <img src="./images/011.png" alt="">
     <span>Xiaomi Watch S1</span>
     <li>腕事俱备</li> 
     <h4>1049元起 <del style="color: #b0b0b0; "> 1099元</del></h4>
      </div>
     <div class="zncd-3">
     <img src="./images/011.png" alt="">
      <span>Xiaomi Watch S1</span>
      <li>腕事俱备</li> 
     <h4>1049元起 <del style="color: #b0b0b0; "> 1099元</del></h4>
     </div>
     </div>
        </div>
        <!-- 秒杀页面 -->
        <div id="msy">
            <div class="msybx">
              <img src="./images/小米秒杀.png" alt="">
              <p>小米秒杀</p>
              <h5>21:00点场 距结束</h5>
              <div class="msybx-box" >
                 <div >
                    <span id="msybx-1">00</span>
                  </div>
                  <div>
                    <span id="msybx-3">00</span>
                  </div>
                  <div>
                    <span id="msybx-5">00</span>
                  </div>
              </div>
            </div>
        </div>
        <!-- 秒杀页面结束 -->
      <div id="yj1">
      <div class="yj2"> 
      <div><i class="iconfont icon-buoumaotubiao46"></i><span>预约维修服务</span></div>
      <div><i class="iconfont icon-qitianwuliyoutuihuan "></i><span>7天无理由退换</span></div>
       <div><i class="iconfont icon-15"></i><span>15天免费换货</span></div>
      <div><i class="iconfont icon-liwu"></i><span>满69包邮</span></div>
     <div><i class="iconfont icon-position"></i><span>520余家售后网点</span></div>
     </div>
     <div id="yj3">
         <div class="yj5"></div>
         <div class="yj4">
             <div class="yj6"> 
                <li>帮助中心</li>
                <li>服务支持</li>
                <li>线下门店</li>
                <li>关于小米</li>
                <li>关注我们</li>
                <li>特色服务</li>
             </div>
             <table class="yj7">
                 <tr>
                     <td>账户管理</td>
                     <td>购物指南</td>
                     <td>订单操作</td>
                 </tr>
                 <tr>
                     <td>售后政策</td>
                     <td>自动服务</td>
                     <td>相关下载</td>
                 </tr>
                 <tr>
                     <td>小米之家</td>
                     <td>服务网点</td>
                     <td>授权体验店/专区</td>
                 </tr>
                 <tr>
                     <td>了解小米</td>
                     <td>加入小米</td>
                     <td>投资者关系</td>
                     <td>企业社会责任</td>
                     <td>廉洁举报</td>
                 </tr>
                 <tr>
                     <td>新浪微博</td>
                     <td>官方微信</td>
                     <td>联系我们</td>
                     <td>公益基金会</td>
                 </tr>
                 <tr>
                     <td>F 码通道</td>
                     <td>礼物码</td>
                     <td>防伪查询</td>
                 </tr>
             </table>
             <div class="yj8">
                 <p>400-100-5678</p>
                 <li>8:00-18:00 (仅收市话费)</li>
                 <div class="yj8-1">
                     <span class="iconfont icon-duanxin"></span>
                     <i>人工客服</i>
                 </div>
                <div class="yj8-2"> <i>关注小米:</h5><span class="iconfont icon-xinlangweibo"></span><span class="iconfont icon-weixin5"></span></div>
             </div>
         </div>
     </div>
     <div id="wb">
         <div class="wb-1">
             <div class="wb-2">
                 <img src="./images/小米_03.png" alt="">
                 <li style="margin-left: 24px;"><a href="">小米商城 |</a></li>
                 <li><a href=""> MIUI |</a></li>
                 <li><a href=""> 米家 |</a></li>
                 <li><a href=""> 米聊 |</a></li>
                 <li><a href=""> 多看 |</a></li>
                 <li><a href=""> 游戏 |</a></li>
                 <li><a href=""> 攻企服务 |</a></li>
                 <li><a href= ""> 小米天猫店 |</a></li>
                 <li><a href=""> 小米集团隐私政策 |</a></li>
                 <li><a href=""> 小米公司儿童信息保护规则 |</a></li>
                 <li><a href=""> 小米商城隐私政策 |</a></li>
                 <li><a href=""> 小米商城用户协议 |</a></li>
                 <li><a href=""> 问题反馈 |</a></li>
                 <li><a href=""> Select Location |</a></li>
                 <div class="wb-3">
                     <p><a href="">北京互联网法院法律服务工作站 |</a></p>
                     <p><a href="">中国消费者协会 |</a></p>
                     <p><a href="">北京市消费者协会 |</a></p>
                 </div>
                 <div class="wb-4">
                    <p>◎mi com京ICP证110507号京ICP备10046444号京公网安备11010802020134号京网文[2020]0276 042号</p> 
                    <p>(京)网械平台备字(2018) 第00005号互联网药品信息服务资格证(京)非经营性-2014 0090营业执照医疗器械质量公告</p> 
                    <p>增值电信业务许可证网络食品经营备案京食药网食备202010048食品经营许可证</p> 
                    <p>违法和不良信息举报电话: 171-5104 4404知识产权侵权投诉本网站所列数据,除特殊说明，所有数据均出自我司实验室测试</p>
                 </div>
                 <img src="./images/小米.000png_03.png" alt="" class="imgs">
                </div>
             </div>
         </div>
     </div>
</body>
</html>
<script>
    var swiper = new Swiper('.lunbo',{
  navigation: {
    nextEl: '.swiper-button-next',
    prevEl: '.swiper-button-prev',
  },
  autoplay:true,
  loop:true,
    
});

  </script>
  <script src="./js/jquery-1.12.4.js"></script>
  <script src="./js/index.js"></script>